<template>
	<view class="container">
		<banner :list="carouselList"></banner>
		<view class="menu-container">
			<menuList :menuList="menuList"></menuList>
		</view>
		<view class="recommend-view" v-for="(item,index) in recommendList">
			<navigator :url="item.url">
				<image :src="item.imgUrl" mode="widthFix"></image>
			</navigator>
		</view>
	</view>
</template>

<script>
	import banner from '../index/banner.vue'
	import menuList from "../menuList/menuList.vue"
	export default{
		components:{
			banner,
			menuList
		},
		data(){
			return {
				carouselList:[
					{
						link: "",
						image: "/static/local/slider1.jpg"
					}
				],
				menuList: [
					{
						imgUrl: "/static/home/smbj.png",
						title: "上门保洁",
						url: ""
					},
					{
						imgUrl: "/static/home/smbj.png",
						title: "上门保洁",
						url: ""
					},
					{
						imgUrl: "/static/home/smbj.png",
						title: "上门保洁",
						url: ""
					},
					{
						imgUrl: "/static/home/smbj.png",
						title: "上门保洁",
						url: ""
					},
					{
						imgUrl: "/static/home/smbj.png",
						title: "上门保洁",
						url: ""
					},
				],
				recommendList:[
					{
						imgUrl:"/static/local/slider1.jpg",
						url: ""
					},
					{
						imgUrl:"/static/local/slider2.jpg",
						url: ""
					},
					{
						imgUrl:"/static/local/slider3.jpg",
						url: ""
					},
				],
			}
		},
		onLoad(options) {
			uni.setNavigationBarTitle({
			　　title: options.title
			})
		}
	}
</script>

<style lang="scss">
	.recommend-view{
		width: 100%;
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding: 0 30rpx;
		
		image{
			display: block;
			width: 100%;
			margin: 10rpx auto;
		}
	}
</style>
